/**
 * @author shaosong
 * @description
 */
import { CheckCircleOutlined, CopyOutlined } from '@ant-design/icons'
import { Icon } from '@blueprintjs/core'
import { Button, message } from 'antd'
import copy from 'copy-to-clipboard'
import React, { useEffect, useState } from 'react'

export class CopyButtonProps {
  text? = '' as string
}

const CopyButton: React.FC<CopyButtonProps> = props => {
  const [isCopy, changeIsCopy] = useState(false)

  useEffect(() => {
    if (isCopy) {
      const time = setTimeout(() => {
        changeIsCopy(pre => !pre)
        clearTimeout(time)
      }, 3000)
    }
  }, [isCopy])

  return React.useMemo(
    () => (
      <Button
        type="text"
        icon={
          isCopy ? (
            <CheckCircleOutlined color="#72C040" style={{ color: '#72C040' }} />
          ) : (
            <CopyOutlined />
          )
        }
        onClick={() => {
          copy(props.text as string)
          changeIsCopy(true)
          message.success('已复制')
        }}
      >
        复制
      </Button>
    ),
    [props.text, isCopy]
  )
}

export default CopyButton
